<style>
    .content-box {
        background-color: #FFF;
        padding: 15px 0 50px 15px;
        margin-bottom: 15px;
        border-radius: 4px;
    }
    .save-btn {
        border: none;
        background: #4B5BDE;
        border-radius: 8px;
        color: #FFFFFF;
        padding: 10px 20px;
    }

    .checkbox2 {
        padding-top: 4px!important;
    }

    .title {
        margin-left: 20px;
        color: #838989;
    }
</style>

<form id="add-form" class="form-horizontal content-box" role="form" data-toggle="validator" method="POST" action="">
    <div class="form-group" style="display: flex;align-items: center;">
        <div class="title">渠道名称</div>
        <div class="col-xs-12 col-sm-8">
            <input id="distributor_name" data-rule="required" class="form-control" name="distributor_name" type="text" placeholder="请输入" value="">
        </div>
    </div>
    <div class="form-group select_store" style="display: flex;align-items: center;">
        <div style="margin-left: 15px;">所在地区</div>
        <div class="col-xs-12 col-sm-8">
            <div style="margin-top: 18px;display: flex;">
                <el-cascader
                        v-model="value"
                        :options="options"
                        @change="handleChange"
                        placeholder="请选择地区">
                </el-cascader>
            </div>
        </div>
    </div>
    <div class="form-group" style="display: flex;align-items: center;">
        <div class="title">渠道主体</div>
        <div class="col-xs-12 col-sm-8">
            <div class="radio">
                <label><input name="distributor_type" value="1" type="radio"/><span>大学</span></label>
                <label><input name="distributor_type" value="2" type="radio"/><span>高中</span></label>
                <label><input name="distributor_type" value="3" type="radio"/><span>中职</span></label>
                <label><input name="distributor_type" value="4" type="radio"/><span>机构</span></label>
                <label><input name="distributor_type" value="5" type="radio"/><span>个体</span></label>
                <label><input name="distributor_type" value="6" type="radio"/><span>政府</span></label>
            </div>
        </div>
    </div>
    <div class="form-group" style="display: flex;align-items: center;">
        <div class="title">合作年份</div>
        <div class="col-xs-12 col-sm-8">
            <div class="radio">
                <label><input name="year" value="2023" type="radio"/><span>2023</span></label>
                <label><input name="year" value="2024" type="radio"/><span>2024</span></label>
                <label><input name="year" value="2025" type="radio"/><span>2025</span></label>
                <label><input name="year" value="2026" type="radio"/><span>2026</span></label>
            </div>
        </div>
    </div>
    <div class="form-group" style="display: flex;align-items: center;">
        <div class="title">发行价格</div>
        <div class="col-xs-12 col-sm-8">
            <input id="price" data-rule="required" class="form-control" name="price" type="number" placeholder="单价(单位：元)" value="">
        </div>
    </div>
    <div class="form-group" style="display: flex;align-items: center;">
        <div class="title">手机号码</div>
        <div class="col-xs-12 col-sm-8">
            <input id="username" data-rule="required" class="form-control" name="username" type="text" placeholder="请输入" value="">
        </div>
    </div>
    <div class="form-group" style="display: flex;align-items: center;">
        <div class="title">邮寄地址</div>
        <div class="col-xs-12 col-sm-8">
            <input id="address" data-rule="" class="form-control" name="address" type="text" placeholder="请输入" value="">
        </div>
    </div>
    <div class="form-group" style="display: flex;align-items: center;">
        <div class="title">发票抬头</div>
        <div class="col-xs-12 col-sm-8">
            <input id="invoice_title" data-rule="" class="form-control" name="invoice_title" type="text" placeholder="请输入" value="">
        </div>
    </div>
    <div style="position: relative;">
        <button class="save-btn add_button" type="button">添加</button>
    </div>
</form>

<script src="__CDN__/assets/addons/shopro/libs/vue.js"></script>
<script src="__CDN__/assets/addons/shopro/libs/element/element.js"></script>
<script src="__CDN__/assets/addons/shopro/libs/moment.js"></script>
<link rel="stylesheet" href="__CDN__/assets/addons/shopro/libs/element/element.css">
<link rel="stylesheet" href="__CDN__/assets/addons/shopro/libs/common.css">